import 'package:flutter/material.dart';
import 'package:meePet/utils/LogUtils.dart';
import 'package:meePet/utils/ext/SizeExt.dart';
import 'package:meePet/utils/ext/StringExt.dart';

import '../../../app/LocalColor.dart';
import '../../../bean/RolePageData.dart';

class CustomRoleItem {
  Widget getCustomRoleView(RoleData roleData) {
    return Container(
      width: 335.sw(),
      clipBehavior: Clip.antiAlias,
      decoration: BoxDecoration(
        color: LocalColor.color_FF2D2C37,
        borderRadius: BorderRadius.all(Radius.circular(16.sw())),
      ),
      child: Stack(
        alignment: Alignment.topLeft,
        children: [
          Column(
            children: [
              _getTopBar(roleData),
              Visibility(
                  visible: !(roleData.description == null ||
                      roleData.description!.isEmpty),
                  child: Container(
                    alignment: Alignment.topLeft,
                    margin: EdgeInsets.only(
                        left: 15.sw(), right: 15.sw(), top: 10.sw()),
                    child: Text(
                      "${roleData.description}",
                      style: TextStyle(
                        color: LocalColor.colorWhite80,
                        fontSize: 14.sp(),
                      ),
                      maxLines: 3,
                      textAlign: TextAlign.justify,
                      overflow: TextOverflow.ellipsis,
                    ),
                  )),
              Stack(
                alignment: Alignment.bottomRight,
                children: [
                  Container(
                    alignment: Alignment.bottomCenter,
                    margin: EdgeInsets.only(
                        top: 10.sw(), bottom: 15.sw(), right: 15.sw()),
                    height: 42.sw(),
                    width: 305.sw(),
                    child: "img_appear_enter_bar"
                        .png()
                        .loadImageRes(305.sw(), 42.sw()),
                  ),
                  _getBottomBar(roleData)
                ],
              )
            ],
          )
        ],
      ),
    );
  }

  Widget _getTopBar(RoleData roleData) {
    return Row(
      children: [
        Container(
          alignment: Alignment.topLeft,
          margin: EdgeInsets.only(top: 15.sw(), left: 15.sw()),
          clipBehavior: Clip.antiAlias,
          decoration: BoxDecoration(
            color: LocalColor.color_FF2D2C37,
            borderRadius: BorderRadius.all(Radius.circular(15.sw())),
          ),
          child: roleData.avatarUrl
              .orEmpty()
              .loadImage(w: 72.sw(), h: 72.sw(), fit: BoxFit.cover),
        ),
        Expanded(
            child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                Container(
                  margin: EdgeInsets.only(left: 10.sw(),top: 15.sw()),
                  child: Text(
                    "${roleData.nickname?.omit(6)}",
                    style: TextStyle(
                        color: Colors.white,
                        fontSize: 19.sp(),
                        fontWeight: FontWeight.bold),
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 7.sw(),top: 15.sw()),
                  child: (roleData.sex == 1
                          ? "icon_gender_boy"
                          : "icon_gender_girl")
                      .png()
                      .loadImageRes(16.sw(), 16.sw()),
                ),
                Expanded(child: Container()),
                Container(
                  margin: EdgeInsets.only(right: 15.sw(),top: 15.sw()),
                  child: Text(
                    "${roleData.belongTo?.omit(4)}",
                    style: TextStyle(
                      color: LocalColor.color_FF999999,
                      fontSize: 14.sp(),
                    ),
                    maxLines: 1,
                    overflow: TextOverflow.clip,
                  ),
                ),
              ],
            ),
            Container(
              alignment: Alignment.topLeft,
              margin: EdgeInsets.only(top: 2.sw(), left: 10.sw()),
              child: Text(
                "${roleData.chattedUsers}次聊过${roleData.capsules == 0 ? "" : "/${roleData.capsules}记忆胶囊"}${roleData.theaters == 0 ? "" : "/${roleData.theaters}个剧情"}",
                style: TextStyle(
                  fontSize: 12.sp(),
                  color: LocalColor.color_FF999999,
                ),
              ),
            ),
            Container(
              child: Visibility(
                visible: roleData.tags!=null,
                child: _getTags(roleData.tags!.split("/")),
              ),
            ),
          ],
        ))
      ],
    );
  }

  Widget _getTags(List<String> tags) {
    List<Widget> viewList = [];
    LogUtils.i("标签是" + tags.toString());
    tags.forEach((element) {
      viewList.add(_getTag(element));
    });

    return Container(
      margin: EdgeInsets.only(top: 8.sw(), left: 10.sw()),
      height: 20.sw(),
      child: Wrap(
        clipBehavior: Clip.antiAlias,
        children: viewList,
      ),
    );
  }

  Widget _getTag(String str) {
    return Container(
        decoration: BoxDecoration(
            borderRadius: BorderRadius.all(Radius.circular(10.sw())),
            color: LocalColor.color_FF25242D),
        clipBehavior: Clip.antiAlias,
        padding: EdgeInsets.only(
            left: 8.sw(), top: 2.sw(), right: 8.sw(), bottom: 2.sw()),
        margin: EdgeInsets.only(right: 5.sw()),
        child: Text(
          str,
          style: TextStyle(
            color: LocalColor.color_FF89888D,
            fontSize: 11.sp(),
          ),
        ));
  }

  Widget _getBottomBar(RoleData roleData) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.end,
      children: [
        Expanded(
            child: Container(
          padding: EdgeInsets.only(left: 30.sw(), bottom: 15.sw()),
          child: Text(
            "${roleData.startMsg}",
            style: TextStyle(color: LocalColor.colorWhite60, fontSize: 13.sp()),
            maxLines: 1,
            overflow: TextOverflow.ellipsis,
          ),
        )),
        Container(
          margin: EdgeInsets.only(bottom: 15.sw(), right: 15.sw()),
          width: 104.sw(),
          height: 42.sw(),
          child: (roleData.sex == 1 ? "bg_chat_boy.webp" : "bg_chat_girl.png")
              .img()
              .loadImageRes(1004.sw(), 42.sw()),
        )
      ],
    );
  }
}
